<nav id="navigation" aria-label="Navigation">
  <div>
    <div class="logo">
      <a href="{{ "/" | relative_url }}"><img src="{{ "/images/rook-logo.svg" | relative_url }}"/></a>
    </div>
    <div
      class="hamburger-controls"
      onclick="if (document.body.classList.contains('menu-open')) { document.body.classList.remove('menu-open') } else { document.body.classList.add('menu-open') }; return false;">
      <span></span> <span></span> <span></span>
    </div>
    <ul class="links">
      <!-- TODO: Add this back once docs are re-organized in main rook repo and remove standalone Documentaion link below
        <li class="dropdown">
          <a role="button" href="javascript:void(0)">Documentation</a>
          <div class="dropdown-content">
            <a href="{{ latestDocs }}">ROOK</a>
            <a href="#">Cassandra</a>
            <a href="#">Ceph</a>
            <a href="#">NFS</a>
          </div>
        </li> -->
      <li><a href="{{ latestDocs }}">Documentation</a></li>
      <li class="dropdown">
        <a role="button" href="javascript:void(0)">Community</a>
        <div class="dropdown-content">
          <a href="{{ githubLink }}">GitHub</a>
          <a href="{{ slackLink }}">Slack</a>
          <a href="{{ forumLink }}">Forum</a>
          <a href="{{ twitterLink }}">Twitter</a>
        </div>
      </li>
      <li><a href="{{ blogLink }}">Blog</a></li>
      <li><a class="button small" href="{{ gettingStartedLink }}">Get Started</a></li>
    </ul>
  </div>
</nav>
